<template>
  <div id="app">
  
    <button class="GoTop" title="回到顶部" >  //@click="scrollToTop"
      <i class="gotops"><img src="../public/image/去顶部_to-top.png" alt="" class="gotopimg"></i>
    </button>
  
    <!-- 路由出口组件(一级路由) -->
    <router-view></router-view>
  </div>
</template>

<style lang="less">
@import './common/less/varible.less';

#app {
  font-family: @fontfamily;
  // font-family:"华文行楷"
  margin-bottom: 70px;

  .GoTop {
    width: 50px;
    height: 40px;
    padding: 0;
    background-color: pink;
    position: fixed;
    z-index: 2000;
    border-radius: 5px;
    overflow: hidden;
    bottom: 80px;
    right: 50px;
    transition: all 0.5s;
    display: none;

  }

  .GoTop .gotops {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .GoTop .gotops .gotopimg {
    display: inline-block;
    width: 20px;
    height: 20px;
  }

  .GoTop:hover {
    box-shadow: 0 0 10px 10px rgb(255, 255, 255, .7);
  }

  .GoTop .gotops:hover {
    border-bottom-color: aqua;
  }


}
</style>

<script>

export default {


  mounted() {
    document.title = 'sakura' //"绮梦文渊"
  },

  methods: {
    

  }

}
</script>